<script setup>
import { onMounted, onUnmounted, inject } from 'vue'
import modelLoadHelper from '@/hooks/loadObjModels'

let map, scene, loader

function addModel() {
  loader && loader.addModel()
}
onMounted(() => {
  ({map, scene} = inject('mapScene'))
  const loaderConfig = {
    center: [114.298, 30.502],
    angle: 90,
    scale: {
      x: 6,
      y: 6,
      z: 20
    },
    objUrl: '/src/assets/models/model3/LeosVillage.obj',
    mtlUrl: '/src/assets/models/model3/LeosVillage.mtl',
  }
  loader = new modelLoadHelper(map, loaderConfig)
  addModel()
  map.flyTo({
    center: [114.298, 30.502],
    zoom: 15,
  })
})

onUnmounted(() => {
  loader && loader.removeModel('3d-model')
})
</script>

<template>

</template>

<style lang="scss">

</style>
